<script setup lang="ts">
import {ContentWrapNoHeaderLine} from '@/components/ContentWrap'
import {useIcon} from '@/hooks/web/useIcon'
import {
  ElButton
} from 'element-plus'
import {reactive, ref, unref} from 'vue'
// import {RegionData} from "@/api/balance/region/types";
// import { saveRegionApi} from "@/api/balance/region";
// import Edit from "./edit.vue";
import {FormSchema} from "@/types/form";
import {useValidator} from "@/hooks/web/useValidator";

const {required} = useValidator()

const icons = {
  plusIcon: useIcon({icon: 'ph:plus-bold'}),
  deleteIcon: useIcon({icon: 'ep:delete'})
}

const loading = ref(false)
// const editRef = ref<ComponentRef<typeof Edit>>()
const save = async () => {
  /* const region = unref(editRef)
  await region?.elFormRef?.validate(async (isValid) => {
    if (isValid) {
      loading.value = true
      const data = (await region?.getFormData()) as RegionData
      const res = await saveRegionApi(data)
          .catch(() => {
          })
          .finally(() => {
            loading.value = false
          })
      if (res) {
      }
    }
  }) */
}
const formSchema = reactive<FormSchema[]>([
  {
    field: 'monitorMaxFilesCountInGroup',
    label: '组内监控文件最大数量',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'ipWhiteList',
    label: '管理IP地址白名单',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'maxTimesIdentificationFailed',
    label: '鉴别失败最大次数',
    component: 'Input',
    componentProps: {
      slots: {
        append: true
      }
    },
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'bindingHoursIdentificationFailed',
    label: '鉴别失败限制时间',
    component: 'Input',
    componentProps: {
      slots: {
        append: true
      }
    },
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'passwordComplexity',
    label: '密码复杂度',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'passwordExpiration',
    label: '密码有效期',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'auditHistoryWarningMaxQueryRange',
    label: '审计/历史/告警查询最大范围',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'deleteLog',
    label: '删除日志端操作记录',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'deleteManageLog',
    label: '删除管理端操作记录',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'auditDangerLevel',
    label: '审计危险等级划分',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'statusDangerLevel',
    label: '状态危险等级划分',
    component: 'Input',
    formItemProps: {
      rules: [required()]
    }, colProps: {
      span: 24
    }
  },
  {
    field: 'action',
    label: '　',
    component: 'Input',
    formItemProps: {
      rules: []
    }, colProps: {
      span: 24
    }
  }
]);
const handleReset = () => {
  /* const edit = unref(editRef)
  edit?.elFormRef?.resetFields() */
}
const formData = ref({})
</script>

<template>
  <ContentWrapNoHeaderLine title="管理设置">
    <Edit
        ref="editRef"
        :form-schema="formSchema"
        :current-row="formData"
    />

    <ElButton type="primary" :loading="loading" @click="save">
      提交
    </ElButton>
    <ElButton @click="handleReset">重置</ElButton>
  </ContentWrapNoHeaderLine>
</template>
